<!DOCTYPE html>
<html>

<head>
    <title>-- </title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="__SKIN__/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <script src="__SKIN__/css/admin.css"></script>
    <script src="__SKIN__/js/jquery.js"></script>
    <link href="__SKIN__/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <link href="__SKIN__/css/index.css" rel="stylesheet">
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="__SKIN__/bootstrap-table/bootstrap-table.min.css?v=1.1">
    <!-- Latest compiled and minified JavaScript -->
    <script src="__SKIN__/bootstrap-table/bootstrap-table.min.js"></script>
    <!-- Latest compiled and minified Locales -->
    <script src="__SKIN__/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
    <script src="__SKIN__/js/jmzhfsform.js?v=1.26"></script>

    <script src="__SKIN__/js/vue.min.js"></script>

    <script src="/static/jsencrypt.min.js"></script>
   
    <style>
    .isme
    {
        float: left;
        text-align: left;
        color: blue;
        width: 100%;
    }
    .isnotme
    {
        text-align: left;
        float: left;
        color: green;
        width: 100%;
    }

        .bottom_footer {  

           position: fixed; /*or前面的是absolute就可以用*/  
           width:80%;
           bottom: 0px;  
    }  
    #app
    {
        padding:10px;
    }
    </style>
</head>

<body>

    <div class="chatmsg"></div>


<DIV  id="app">

        <div v-for="(chat,index) in chatlist"  :class="chat.openid==myopenid?'isme':'isnotme'" >

             {{unpackchat(chat.msg)}}
        </div>

   
</DIV> 


  <div>
      <form id="form1">
       <input type="hidden" name="openid" id="openid" value="">
       <textarea style="width:70%;height:80px;" name="msg" id="msg"></textarea>
       <input type="button" onclick="sendchat()" value="发送">

   </form>

  </div> 

  

    <div class="msg"></div>
   


    <script>
    //公钥
var PUBLIC_KEY = 'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC3NabYwNsHJsMzzSR8Zx6L9RGZrI8mrF/cONfI7Nh+roGtxDQ2RU8geozsr9Mg4iD'
+'hWXGrOYTCoivtHOk4Oy00FBdXgpwJiaSb/jFNnFy8rqQ4ijVZrptq6wNKKmWLQHAl+g7gl0Gbyw9z+6xYl7D4OlNvXoyh/BoEDbgvJ5hg7QIDAQAB';
//私钥
var PRIVATE_KEY = 'MIICeQIBADANBgkqhkiG9w0BAQEFAASCAmMwggJfAgEAAoGBALc1ptjA2wcmwzPNJHxnHov1EZmsjyasX9w418js2H6u'+
'ga3ENDZFTyB6jOyv0yDiIOFZcas5hMKiK+0c6Tg7LTQUF1eCnAmJpJv+MU2cXLyupDiKNVmum2rrA0oqZYtAcCX6DuCXQZvLD3P7rFiXsPg6U29ejKH8GgQNu'+
'C8nmGDtAgMBAAECgYEAnPZmX8W64UGgc70JyVs/nID190cTzfpYloBMv2PLh51SlOFIKkbvJ9BW9GEe7UlPCkJrVFsPFwGByL/AP+DTNBlu7yTpnGxx5+SNK4O7UnsiMSR094on5AWN+MKxfOUAUip2dPNqm476RGac740YF2cxnK5SJWYZz1GRaEBugIECQQDzfEWPzGdZ18aCvHYpA+fkrDv0OC/BLsNwpL586UhPGKR7uPYgqJzeiCtkNthy1Ll9JHejnLAgq8oaEOcZ+KGlAkEAwKBIjWOIoGf6mkXhNBrG73ruRo4PlAbXrFS90+t5yjLVgEQVDrysTP8gBwMDiTkXCggfUv0husCnSdvewnkPqQJBAL/OdtHnuMbapyOYKRD4ZbYLRBOIK35oQ0e6T+EAuJiulexs8V8a1LCs3lnMpsgW8aQ2lRTLOygRjFzqUdNwvI0CQQCiQWFb18+qbmulr983KKcR6pbzT47HvcvGGcucyulX7OHynWavdzYb1XuA7IT5/eDuTlE0co0K5mUDzfUiEx+hAkEAijBvAH7vifPmX293Jw0ZYMdRWdGNpEp+qiN1OIIzIHpxO794h6ni2XDvI/Vhg/nocZyrgzlAd6EDs4cFUvKasg==';
//使用公钥加密
var encrypt = new JSEncrypt();
//encrypt.setPrivateKey('-----BEGIN RSA PRIVATE KEY-----'+PRIVATE_KEY+'-----END RSA PRIVATE KEY-----');
encrypt.setPublicKey('-----BEGIN PUBLIC KEY-----' + PUBLIC_KEY + '-----END PUBLIC KEY-----');



    </script>


<SCRIPT>
 
        var vue = new Vue({
            el: '#app',
            data: {
                msg: "",
                myopenid:"",
                title: "fffffff",
                config: {},
                chatlist: [{"name":"我","msg":"内容"}]
            },
            methods:{
                unpackchat(text){
                    var decrypt = new JSEncrypt();
                   decrypt.setPrivateKey('-----BEGIN RSA PRIVATE KEY-----'+PRIVATE_KEY+'-----END RSA PRIVATE KEY-----');
                  return decrypt.decrypt(text);
                  
                },
            }
           
        });
        
         </SCRIPT>

    <script>

        function dodata(data)
        {
          
            if(data.url!=""){
              //  document.location.href=data.url;return; //没有登录，则转登录
            }
            if(data.code>0){
                $("#openid").val(data.openid);
                vue.myopenid=data.openid;
                //alert(data.openid);
            }
         
        }

  
    </script>
 <script src="/autologin/wxlogin/checkloginjsonp?config_name=wx&callback=dodata"></script>


 
 <script type="text/javascript">
 function sendchat()
 {       
    var text=$("#msg").val();
    var text = encrypt.encrypt(text);
    $("#msg").val(text);
   

     $.ajax({
            //几个参数需要注意一下
                 type: "POST",//方法类型
                 dataType: "json",//预期服务器返回的数据类型
                 url: "/chat/index/sendchat" ,//url
                data: $('#form1').serialize(),
                 success: function (result) {
                    data=JSON.parse(result);
                     if (data.id>0) {

                      
                    }
                     ;
                },
                error : function() {
                    //alert("异常！");
                 }
            });
            $("#msg").val("");
  }
  
  function loadchat()
 {       
     $.ajax({
                 type: "GET",//方法类型
                 dataType: "json",//预期服务器返回的数据类型
                 url: "/chat/index/chatlist" ,//url
              
                 success: function (result) {
                    vue.chatlist=JSON.parse(result);
                },
                error : function() {

                 }
            });

  }
  loadchat();
  
 setInterval(loadchat, 400);
</script>
</body>


</html>